/*jslint evil: true, plusplus: true, passfail: false, browser: true, devel: true, indent: 4, maxerr: 40, maxlen: 100 */

//dom ready
$(function () {
    var objs;

    //single configuration
    $("#container").rotateSliders({
        startRandom: true,
        animationDuration: 400,
        timePaneDisplays: 2500,
        circles: true,
        width: 550,
        height: 300,
        color: '#19A319'
    });

    //array of configs
    objs = [{
        startRandom: false,
        animationDuration: 300,
        timePaneDisplays: 4000,
        width: '300px',
        height: '225px',
        circles: true
    }, {
        startRandom: false,
        animationDuration: 1000,
        timePaneDisplays: 2000,
        width: '200px',
        height: '250px'
    }, {
        startRandom: true,
        animationDuration: 1000,
        timePaneDisplays: 0,
        width: '600px',
        height: '300px',
        circles: true,
        color: '#f60'
    }];

    //add a config to each slider with class "test"
    $(".test").each(function (i) {
        $(this).rotateSliders(objs[i]);
    });

    //display images as background images for styling purposes only 
    $('img').each(function () {
        var myImg = $(this).attr('src');
        $(this).parent().css({
            'background-image': 'url(' + myImg + ')',
            'background-size': '100% auto'
        });
        $(this).remove();
    });
});
